<template>
	<div class="root">
		 <my-header htitle="插片清洗" :date="date"></my-header>
		 <count-info :waitMatTotal="waitMatTotal"
		             :finishedDayCount="finishedDayCount"
		             :finishedMonthCount="finishedMonthCount"
		             :waitLeaveCount="waitLeaveCount"
		             :damageDay="damageDay"></count-info>
		 <content-info :list="contentInfoList"></content-info>
		 <div class="h20"></div>
		 <plan :list="planList"></plan>
	</div>
</template>
<script>
import MyHeader from './components/Header'
import CountInfo from './components/CountInfo'
import ContentInfo from './components/ContentInfo'
import Plan from './components/Plan'

import {getPluginsClear,getPluginsClearPlan} from "../../api/chart"


export default{
	components:{
	 	MyHeader,
	 	CountInfo,
	 	ContentInfo,
	 	Plan
	},
	data () {
        return{
        	date:'',
			waitMatTotal:'',
			finishedDayCount:'',
			finishedMonthCount:'',
			waitLeaveCount:'',
			damageDay:'',
			contentInfoList:[],
			planList:{}
        } 
	},
	methods:{
        getInfo () {
	        getPluginsClear().then((data)=>{
	        	this.date = data.date
	            this.waitMatTotal = data.cleanWait
	        	this.finishedDayCount = data.cleanCount
	        	this.finishedMonthCount = data.monthCleanCount
	        	this.waitLeaveCount = data.unloadWait
	        	// this.damageDay = data.damageDay
	        }).catch((error) => {
	            console.log(error)
	        })

	     	getPluginsClearPlan().then((data) => {
                this.planList = data.msg
	     	}).catch((error) => {
                 console.log(error)
	     	})
	    }

    },
    mounted () {
        clearTimeout(timer)
        this.getInfo()
        var timer = setInterval(()=>{
        	this.getInfo()
        },10000)
    }
}
</script>
<style  scoped>
.root{
	background:rgb(255,112,126);
	width:1024px;
	height:768px;
}

.h20{
	width:100%;
	height:20px;
}

</style>